<template>
  <div>
    <!-- 附件 -->
    <template>
      <div>
        <Row style="margin-bottom: 10px;">
          <Col span="5">
          <Button @click="downloadFile">
            <Icon style="line-height: 8px;padding-right:8px;" type="ios-cloud-download-outline" />下载附件模板</Button>
          </Col>
        </Row>
      </div>
    </template>
    <!-- 附件模板 -->
    <Modal v-model="showFileMould" @on-ok="showFileMould = false" title="附件模板" :mask-closable="false" footer-hide>
      <div style="position: relative;">
        <template v-if="filesList != undefined && filesList != null &&  filesList.length > 0">
          <List v-for="(item,index) in filesList" :key="index">
            <a href="javascript:void(0)" @click="downLoad(item)">
              <ListItem>
                <ListItemMeta>
                  <template slot="title">
                    <p>{{(index + 1) + '、' + item.fileName}}</p>
                  </template>
                </ListItemMeta>
              </ListItem>
            </a>
          </List>
        </template>
        <div v-else class="gcontent" style="text-align:center">
          <span style="font-size: 13px;margin-left: 15px;color:#bbb; ">暂无附件模板</span>
        </div>
        <Spin size="large" fix v-if="loadingSpin">下载附件中...</Spin>
      </div>
    </Modal>
  </div>
</template>
<script>
  import Axios from 'axios'

  export default {
    data() {

      return {
        loadingSpin: false,
        showFileMould: false,
        httpHeader: {
          Authorization: this.$store.state.token
        },
        fileUrl: this.CONFIG.file_url,
        file: null,
        loadingStatus: false,
      }
    },
    methods: {
      downloadFile() {
        this.showFileMould = true
      },
      // 下载模板
      downLoad(i) {
        this.loadingSpin = true
        var that = this;
        var url = this.fileUrl + '/get/' + i.fileUrl
        Axios.get(url, {
            responseType: 'blob'
          })
          .then(function(response) {
            var blob = new Blob([response.data])
            var downloadElement = document.createElement('a');
            var href = window.URL.createObjectURL(blob); //创建下载的链接
            downloadElement.href = href;
            downloadElement.download = i.fileName
            document.body.appendChild(downloadElement);
            downloadElement.click(); //点击下载
            document.body.removeChild(downloadElement); //下载完成移除元素
            window.URL.revokeObjectURL(href); //释放掉blob对象
            that.loadingSpin = false
          }).catch(function(error) {
            if (error && error.response) {
              if (error.response.status == 403) { //forbiden
                that.$Notice.error({
                  title: '请求拒绝',
                  desc: '您没有当前操作权限',
                });
              } else if (error.response.status == 401) { //forbiden
                that.$Notice.error({
                  title: '用户未登陆',
                  desc: '请重新登陆该系统',
                });
              } else if (error.response.status == 400) { //forbiden
                that.$Notice.error({
                  title: '访问数据不存在',
                  desc: '请联系管理员进行处理',
                });
              } else if (error.response.status == 406) { //forbiden
                that.$Notice.error({
                  title: '访问数据不存在',
                  desc: error.data,
                  duration: 5,
                });
              } else {
                that.$Notice.error({
                  title: '网络异常',
                  desc: '请联系管理员进行处理',
                });
              }
            } else if (error == 400) {
              that.$Notice.warning({
                title: '访问数据不存在',
                desc: '请联系管理员进行处理',
              });
            } else if (error == 403) { //forbiden
              that.$Notice.error({
                title: '请求拒绝',
                desc: '您没有当前操作权限',

              });
            } else if (error == 404) {
              that.$Notice.error({
                title: '访问数据有误',
                desc: '请联系管理员进行处理',
              });
            } else if (error == 401) { //forbiden
              that.$Notice.error({
                title: '用户未登陆',
                desc: '请重新登陆该系统',
              });
            } else if (error == 406) { //forbiden
              that.$Notice.error({
                title: '访问数据不存在',
                desc: "请先配置审批节点审批人信息",
                duration: 5,
              });
            } else {
              that.$Notice.error({
                title: '网络异常',
                desc: '请联系管理员进行处理',
              });
            }
            that.loadingSpin = false
          });
      },
    },
    props: {
      filesList: {},
    },
  }
</script>
